import React, { useEffect, useState } from "react";
import axios from "axios";
import { getGoods } from "../api/goods";
//导入 interface. 
import type { GoodsItem } from "../api/goods/types";

//接口地址  api.xiaohigh.com/goods
export default function AxiosCom() {
  //声明一个状态
  let [goods, setGoods] = useState<GoodsItem[]>([]); // [] => 类型 []
  //发送请求
  useEffect(() => {
    //声明一个异步函数
    let getData = async () => {
      //发送请求
      let result = await getGoods();
      //更新状态
      // result.data[0].
    };
    getData();
  }, []);

  return <div>
    <h2>商品列表</h2>
    <ul>
      {
        goods.map(item => {
          return <li key={item.id}>{item.title}</li>
        })
      }
    </ul>
  </div>;
}
